<template>
 <div>
 <div align="center">
    <form name="form1" action="" method="" target="">
      <div style="display:none;">&nbsp;</div>
      <table class="content_report" border="0" cellpadding="0" cellspacing="0">
        <thead>
          <tr>
            <td align="center">
              <br>
              <table width="100%" border="0" cellpadding="0" cellspacing="0">
                <tbody>
                  <tr>
                    <td width="160" class="reportSmallNormal">&nbsp;</td>
                    <td align="center" style="font-family:Arial;font-size:12pt;font-weight:bold;">
                      <div>支出報表</div>
                    </td>
                    <td width="200" class="reportSmallNormal" align="right">
                      <div>列印日期: {{ time }}</div>
                    </td>
                  </tr>
                </tbody>
              </table>
              <br>
            </td>
          </tr>
          <tr>
            <td align="center">
              <table border="0" cellpadding="2" cellspacing="0">
                <tbody>
                  <tr>
                    <td class="reportSmallNormal" align="left" valign="top">加入日期:</td>
                    <td class="reportSmallNormal" align="left" valign="top">
                      {{ obj.time && obj.time.length > 1 ?
                          `${obj.time[0]}至${obj.time[1]}` : `所有`
                      }}
                    </td>
                  </tr>
                </tbody>
              </table>
              <br>
            </td>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td align="center">
              <table width="1500" border="0" cellpadding="2" cellspacing="0" style="table-layout:fixed;">
                <colgroup>
                  <col width="200"><!-- 日期 -->
                  <col width="100"><!-- 分校 -->
                  <col width="100"><!-- 支出項目 -->
                  <col width="100"><!-- 備註 -->
                  <col width="100"><!-- 數量	 -->
                  <col width="100"><!-- 金額 -->
                </colgroup>
                <thead>
                  <tr>
                    <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">日期</td>
                    <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">分校</td>
                    <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">支出項目</td>
                    <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">備註</td>
                    <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">數量</td>
                    <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">金額</td>
                  </tr>
                </thead>
                <tbody v-for="(item, index) in list" :key="index">
                  <tr>
                    <td class="reportSmallNormal" align="left" valign="top">{{item.create_time}}</td>
                    <td class="reportSmallNormal" align="left" valign="top">{{item.school_name}}</td>
                    <td class="reportSmallNormal" align="left" valign="top">{{item.name}}</td>
                    <td class="reportSmallNormal" align="left" valign="top">{{item.remark}}</td>
                    <td class="reportSmallNormal" align="left" valign="top">{{item.num}}</td>
                    <td class="reportSmallNormal" align="left" valign="top">{{item.money}}</td>
                  </tr>
                  <!-- <tr v-for="(childItem, childIndex) in item.course_info" :key="childIndex">
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                    <td class="reportSmallNormal" align="left" valign="top"><br></td>
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                    <td class="reportSmallNormal" align="left" valign="top" style="border-bottom:1px solid #000">{{
                        childItem.name
                    }}</td>
                    <td class="reportSmallNormal" align="left" valign="top">{{ childItem.price }}</td>
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                    <td class="reportSmallNormal" align="left" valign="top"></td>
                  </tr> -->
 
                </tbody>
              </table>
            </td>
          </tr>
          <tr>
            <td align="center">
              <br>
              <span class="reportSmallNormal">*** 報表完 ***</span>
            </td>
          </tr>
          <tr>
            <td align="center">&nbsp;</td>
          </tr>
  
        </tbody>
      </table>
    </form>
  </div>
 </div>
</template>

<script setup>
import {ref,reactive,onMounted} from 'vue'
import {getTime} from '@/common/function.js'
const time = ref('')


const props = defineProps({
    list:Object,
    obj:Object,
    num:[String,Number]
})
const tableData = ref([])
const obj = ref([])
// const num = ref('')
tableData.value = props.list
obj.value = props.obj
// num.value = props.num

console.log(props.obj);
onMounted(() => {
    time.value = `${getTime().nowDate} ${getTime().nowTime}`
})
</script>

<style scoped lang='less'>
thead {
  display: table-header-group;
}

tfoot {
  display: table-footer-group;
}

.reportSmallBoldNormal {
  font-family: Arial;
  font-size: 8pt;
  font-weight: bold;
}

.reportSmallNormal {
  font-family: Arial;
  font-size: 8pt;
}
</style>